<meta charset="UTF-8" />

<div id="app"></div>

<link rel="stylesheet" type="text/css" href="./style.css">

<script src="./SplitNumber.js"></script>
<script src="./Draw.js"></script>

<template id="title_template">
	y=1/x
</template>

<script>
	(() => {
		/**
			* @typedef { Object } Config
			* @property { HTMLElement } element
			* @property { string } title_template
			* @property { () => HTMLInputElement[] } other_inputs
			* @property { (value: number)=>{ x: number; y: number; } } math_calc
			* @property { boolean } math_calc_input_x
			* @property { number } x_axis_range_value
			* @property { number } y_axis_range_value
			* @property { number } draw_count_value
			*/

		/** @type { (config: Config) => void; } */
		const Draw = window.Global_Draw;

		const element = document.getElementById("app");
		const title_template = document.getElementById("title_template").innerHTML;

		Draw({
			element,
			title_template,
			x_axis_range_value: 3,
			y_axis_range_value: 600,
			draw_count_value: 40000,
			other_inputs: () => [document.getElementById("reduce_value_input")],
			math_calc_input_x: true,
			math_calc: (x) => {
				const y = 1 / x;
				return { x, y };
			},

		});
	})();
	/**
用极限解释分母为什么不能为0
当一个数越接近于0时，
把它分大于0时接近0，小于0时接近于0，两种方向。
当一个数从大于0的时侯接近于0时，999、60，50，10，6...，这个数的趋势是越来越小，
当这个数小于1以后接近于0时，1/2、1/10、1/99、1/999
最后我们认为这个数是1/∞。
而这个数小于0时候接近于0时。
把这个接近于0的数作为1/x的分母时，
大于0接近于0，结果是1/1/∞ = ∞。
小于0接近于0，结果是1/-1/∞ = -∞。
一个数从大于0与小于0两个方向越接近于0时，
作为分母这两个方向最后得到的值差距越大(比如：y=1/x)，
所以分母为0不存在，
所以分母不能为0。
	 */
</script>
